<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>JS操作</title>
    <script type="text/javascript" src="js/jquery-1.11.0.js"></script>
    <script type="text/javascript" src="myJs.js"></script>
    <style>
        *{
            padding:0;
            margin:0;
            text-decoration:none;
            list-style:none;
        }
        a:hover{
            background:#330099;
            color:white;
            opacity:0.3;
        }
        a{
            color:#666;
        }
        ul{
            width:800px;
            margin:0 auto;
        }
        li{
            width:100%;
            display:table;
            text-align:center;
        }
        span{
            width:16.7%;
            padding:20px 30px;
            display:table-cell;
            border:1px solid #662233;
        }
        span.price,span.tot_num{
            color:red;
        }
        em,i{
            width:12px;
            height:12px;
            line-height:12px;
            border:1px solid #111;
            font-style:normal;
            display:inline-block;
            cursor:default;
        }
        .num{
            width:30px;
            height:23px;
            line-height:23px;
            background:#fffefe;
            border:1px solid #330099;
            text-align:center;
            color:#ff0099;
            outline:none;
        }
        .total_l{
           border-right:none;
            text-align:right;
            color:lightcoral;
        }
        .total_r{
            border-left:none;
            text-align:left;
            color:lightcoral;
        }
    </style>
</head>
<body>
    <ul>
        <li>
            <span>选择</span>
            <span>商品</span>
            <span>单价</span>
            <span>数量</span>
            <span>总计</span>
            <span>操作</span>
        </li>
        <li>
            <span class="select">
                <label>
                    <input type="checkbox" />
                </label>
            </span>
            <span>冰箱</span>
            <span>
                <b>3599.99</b>
            </span>
            <span>
                <i>&ndash;</i>
                <input type="text" value="0" disabled class="num" />
                <em>&#43;</em>
            </span>
            <span class="price">&yen;</span>
            <span><a href="javascript:;">删除</a></span>
        </li>
        <li>
            <span class="select">
                <label>
                    <input type="checkbox" />
                </label>
            </span>
            <span>洗衣机</span>
            <span>
                <b>2699.99</b>
            </span>
            <span>
                <i>&ndash;</i>
                <input type="text" value="0" disabled class="num" />
                <em>&#43;</em>
            </span>
            <span class="price">&yen;</span>
            <span><a href="javascript:;">删除</a></span>
        </li>
        <li>
            <span class="select">
                <label>
                    <input type="checkbox" />
                </label>
            </span>
            <span>空调</span>
            <span>
                <b>5899.99</b>
            </span>
            <span class="select">
                <i>&ndash;</i>
                <input type="text" value="0" disabled class="num" />
                <em>&#43;</em>
            </span>
            <span class="price">&yen;</span>
            <span><a href="javascript:;">删除</a></span>
        </li>
        <li>
            <span class="select">
                <label>
                    <input type="checkbox" />
                </label>
            </span>
            <span>未来电视</span>
            <span>
                <b>9999.99</b>
            </span>
            <span>
                <i>&ndash;</i>
                <input type="text" value="0" disabled class="num" />
                <em>&#43;</em>
            </span>
            <span class="price">&yen;</span>
            <span><a href="javascript:;">删除</a></span>
        </li>
        <li>
            <span class="select">
                <label>
                    <input type="checkbox" />全选
                </label>
            </span>
            <span class="total_l">总</span>
            <span class="total_r">计</span>
            <span class="tot_num">0</span>
            <span class="price">&yen;</span>
            <span><a href="javascript:;">全部删除</a></span>
        </li>
    </ul>
</body>
</html>